import { PureComponent } from "react";
import pageJson from './index.page.json';
import Scope from './Scope';
import { TreeComponent } from "@/components";
console.log(pageJson);
export default class Home extends PureComponent {
  state: any = {};
  $scope: any;
  constructor(props: any) {
    super(props);
    const that = this;
    this.$scope = new Scope();

    for (const key in this.$scope) {
      if (
        Object.hasOwnProperty.call(this.$scope, key) &&
        Object.prototype.toString.call(this.$scope[key]) !== '[Object Function]' &&
        !['state', 'props', 'updater', 'refs', 'context'].includes(key)
      ) {
        that.state[key] = this.$scope[key];
        let val = this.$scope[key];
        Object.defineProperty(this.$scope, key, {
          set (value) {
            val = value;
            that.setState({
              [key]: value
            })
          },
          get () {
            return val;
          }
        });

      }
    }
  }
  test() { }
  render() {
    return (
      <div>
        <TreeComponent tree={pageJson} scope={this.$scope}/>
      </div>
    );
  }
}